<template>
  <div class="app-container">
    <div>
      <el-date-picker
        v-model="dates"
        type="daterange"
        range-separator="至"
        start-placeholder="开始日期"
        end-placeholder="结束日期"
        :picker-options="pickerOptions"
        @change="changeDate"
      />
      <span style="margin-right: .5em;margin-left: .5em">
        <el-button size="medium" icon="el-el-icon-search" plain @click="getStatistics()">
          查找
        </el-button>
      </span>
      <span style="margin-right: .5em">
        <el-button size="medium" type="primary" icon="el-icon-plus" plain @click="totalExport()">
          导出
        </el-button>
      </span>
      <span style="color:#409EFF;font-size:14px;float:right;margin-right: .8rm;">
        总可提现额度：{{ dmAmount }}
      </span>
    </div>
    <div style="width: 100%;padding-top: 10px;">
      <el-table
        ref="singleTable"
        v-loading="loading"
        :data="list"
        element-loading-text="加载中..."
        show-summary
        border
      >
        <el-table-column fixed prop="username" label="账号" />
        <el-table-column fixed prop="totalAmount" sortable label="金额" />
      </el-table>
    </div>
  </div>
</template>

<script>
import exportExcelCsv from '@/utils/exportExcelCsv'
export default {
  data() {
    return {
      pickerOptions: {
        shortcuts: [{
          text: '最近一周',
          onClick(picker) {
            const end = new Date()
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
            picker.$emit('pick', [start, end])
          }
        }, {
          text: '最近一个月',
          onClick(picker) {
            const end = new Date()
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
            picker.$emit('pick', [start, end])
          }
        }, {
          text: '最近三个月',
          onClick(picker) {
            const end = new Date()
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
            picker.$emit('pick', [start, end])
          }
        }]
      },
      dates: '',
      loading: false,
      startDate: '',
      endDate: '',
      list: [],
      dmAmount: 0
    }
  },
  created() {
    // const date = new Date()
    // this.startDate = `${date.getFullYear()}/${date.getMonth() + 1}/01`
    // this.endDate = `${date.getFullYear()}/${date.getMonth() + 1}/${date.getDate()}`
    // this.dates[0] = (new Date(this.startDate)).getTime()
    // this.getStatistics()
    this.axios.get(`/api/huifu-accounts/1/dm-amount-query`).then((res) => {
      console.log('DM额度', res.data)
      this.dmAmount = res.data.dm_amt
    })
  },
  methods: {
    changeDate(e) {
      console.log(this.dates)
      const startDate = new Date(this.dates[0])
      const endDate = new Date(this.dates[1])
      this.startDate = `${startDate.getFullYear()}/${startDate.getMonth() + 1}/${startDate.getDate()}`
      this.endDate = `${endDate.getFullYear()}/${endDate.getMonth() + 1}/${endDate.getDate()}`
      console.log(this.startDate, this.endDate)
      this.getStatistics()
    },
    getStatistics() {
      if (this.startDate !== '' && this.endDate !== '') {
        this.axios.get(`/manage/deposits`, {
          params: {
            '@filter': `entity.getStatus() == 1 && entity.getInvoice().getPaidTime() >= datetime.get('${this.startDate} 00:00:00') && entity.getInvoice().getPaidTime() <= datetime.get('${this.endDate} 23:59:59')`,
            '@select': `SUM(entity.amount) as totalAmount,entity.user.username as username`,
            '@groupBy': 'entity.user'
          }
        }).then((res) => {
          console.log(res.data)
          this.list = res.data
        })
      } else {
        this.$message.error('请先选择统计日期')
      }
    },
    totalExport() {
      // table数据
      const list = JSON.parse(JSON.stringify(this.list))
      if (list.length === 0) {
        this.$message.error('暂无导出数据')
        return
      }
      const label = {
        'username': '账号',
        'totalAmount': '金额'
      }
      const data = []
      list.map(v => {
        data.push({
          username: v.username,
          totalAmount: v.totalAmount
        })
      })

      exportExcelCsv(label, data, `扫码入款统计.csv`)
    }
  }
}
</script>
